<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>16_排他思想-方法1-点击任意的li,点击的这一个li变成哈哈，其余的li变成呵呵</title>
    </head>
    <body>
        <ul>
            <li>李贵娱</li>
            <li>马志强</li>
            <li>小宇</li>
            <li>大鹏</li>
            <li>老卢</li>
            <li>我</li>
        </ul>

        <script>
            // 点击任意一个li都要有反应
            var li_list =document.querySelectorAll('li');

            for(var i = 0; i < li_list.length; i++){
                li_list[i].onclick = function(){
                    // 反应
                    // 让所有的li的内容变成呵呵
                    for(var j = 0; j < li_list.length; j++){
                        li_list[j].innerHTML = '呵呵';
                    }
                    // 让当前的点击的li的内容变成哈哈
                    // 之所以报错的原因是因为在事件执行之前 for循环执行完毕了
                    // 执行完毕 i变成了 6  
                    // 那么当我点击的时候  i就是6  是6那么就没有对应的元素 所以报错
                    // li_list[i].innerHTML = '哈哈';
                    this.innerHTML = '哈哈';
                }
            }
        </script>
    </body>
</html>